<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content='webkit' name='renderer'/>
    <meta content='ie-stand' name='renderer'/>
    <title>spring-boot</title>
    <link href="static/css/login.css" rel="stylesheet" th:href="@{/css/login.css}" type="text/css"/>
    <link href="static/h-ui/css/H-ui.min.css" rel="stylesheet" th:href="@{/h-ui/css/H-ui.min.css}" type="text/css"/>
    <script src="lib/jquery/1.9.1/jquery.min.js" th:src="@{/lib/jquery/1.9.1/jquery.min.js}"
            type="text/javascript"></script>
    <style>
        @media (min-width: 992px) {
            .container {
                width: 960px
            }
        }

        @media (min-width: 1200px) {
            .container {
                width: 1170px
            }
        }

        @media (min-width: 1300px) {
            .container {
                width: 1270px
            }

            .left-img {
                width: 570px;
                margin-left: 100px;
            }

            .head-box {
                height: 130px;
                line-height: 122px;
            }

            .head-logo {
                width: 340px;
                margin-left: 50px;
            }

            .input_self {
                width: 84%;
            }

            .form_box {
                margin-top: 50px;
            }

            .finish_box {
                margin-top: 10px;
            }
        }

        @media (min-width: 1880px) {
            .container {
                width: 1570px;
            }

            .left-img {
                width: 666px;
                margin-left: 100px;
            }

            .head-box {
                height: 210px;
                line-height: 202px;
            }

            .input_self {
                width: 87%;
                height: 48px;
                text-indent: 10px;
                line-height: 48px;
                outline: none;
                background: #fdfffe;
                font-size: 16px;
                border: 1px solid transparent;
                padding-left: 5px;
                margin-left: 55px;
            }
        }
    </style>
</head>
<body class="body_bg">

<div class="container" style="margin: 0 auto;">

    <div class="row head-box">
        <!--<img class="head-logo" th:src="@{/images/logo.png}" alt="">-->
    </div>
    <div class="row">

        <div class="col-sm-7 col-md-7 ">
            <img alt="" class="left-img" th:src="@{/images/left-img.png}">
        </div>

        <div class="col-sm-5 col-md-5 ">
            <form action="/login" class="form_box" id="form1" method="post" th:action="@{/login}">

                <div class="input_box head-login">
                    <p style="color:#4252d6;font-size: 25px;margin-bottom: 0;">用户登录</p>
                    <p style="color:#a9aaac;font-size: 17px;margin-bottom: 0;">USER LOGIN</p>
                </div>

                <div class="input_box">
                    <div class="user-box">
                        <input class="input_self" name="username" placeholder="请输入账户" style="background: #fff;"
                               type="text"/>
                    </div>
                </div>

                <div class='blank_30'></div>

                <div class="input_box">
                    <div class="password-box">
                        <!--<input class="input_self" type="text" placeholder="请输入密码" name="" id="" />-->
                        <input class="input_self" name="password" placeholder="请输入密码" style="background: #fff;"
                               type="password"/>
                    </div>
                </div>

                <div class='blank_30'></div>
                <!--<div class="input_box">-->
                <!--<input class="input_self" style="width:60%" type="text" placeholder="请输入验证码" name="" id="" />-->
                <!--<img src="http://api2.itenscen.cn/captcha.html" style="width:30%;height:30px;float:right;border:1px solid #ccc;">-->
                <!--</div>-->
                <div class="input_box">
                    <label class="my-check"> <input type="checkbox"/> 记住用户名和密码</label>
                    <span class="alert" style="font-size:13px;color:red;float:right;"
                          th:if="${param.logout}">您已退出登录</span>
                    <span class="alert alert-error" style="font-size:13px;color:red;float:right;"
                          th:if="${param.error}" th:text="${session.validatecode_error}">There was an error, please try again</span>
                </div>

                <div class="finish_box">
                    <input class="finish_btn" id="finish" name="finish" type="submit" value="登 录"/>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function () {
        // if(window !=top){
        // 	top.location.href=location.href;
        // }

        $(window).on('resize load', function () {
            var win_height = $(window).height();

        })
    })
</script>
</html>